<!-- Add Contact Card Display when users scans someones QR code or when a contact URL is entered -->
<div class="fm-dialog mobile main-block hidden" id="mobile-ui-contact-card">
    <div class="mobile content-row first">
        <div class="mobile content-cell">
            <a class="mobile logo" href="https://mega.nz"></a>
            <div class="mobile fm-icon top-icon menu right dl-page"></div>
            <div class="mobile fm-dialog-close"></div>
            <div class="mobile white-block">
                <div class="mobile avatar-name-block">
                    <div class="mobile main-avatar">
                        <!-- Avatar styles need to be applied to the div below
                             Semi-big-avatar is applied to define the shape and size of the avatar
                             colorX is used to define the colour
                             Random string is used to define contact key -->
                        <!--<div data-color="color7" class="mobile avatar-wrapper avatar XX3wW35s4bc color7 semi-big-avatar"><span><i class="verified_icon"></i>C</span></div>-->
                        <!-- If user has an avatar img, it is inserted into the img div below, this div should be hidden if the user has not uploaded an image and vice versa, the div main-wrapper should be hidden if there is an image selected -->
                        <div class="mobile avatar-wrapper avatar">
                            <img alt="" />
                        </div>
                        <!-- Contact verification message should displayed when the contact has been successfully added to their contact list -->
                        <!--<div class="mobile contact-verification">
                            <i class=""></i>
                        </div>-->
                    </div>
                </div>
                <div class="mobile contactname">"Name of contact" added</div>
                <div class="mobile file-download-info">
                    <div class="mobile contactemail">To share files or chat with "Insert Name", please use the MEGA app or access MEGA on your desktop.</div>
                </div>
                <!-- Add inline-buttons class to div below to show two buttons on the same line.
                     Add hidden class to the second red-button -->
                <div class="mobile buttons">
                    <a class="mobile red-button first add-contact"> <i></i> <span>[$101]</span> </a>
                    <a class="mobile red-button second login hidden"> <i></i> <span>Login</span> </a>
                </div>
                <!-- Close button should be hidden if a user is not logged in. As there are only two available options -->
                <a class="mobile text-button third cancel"><span>[$148]</span> </a>
            </div>
        </div>
    </div>
</div>
